﻿

#he{
    height: 100px;
    width: 100%;
    border: 5px solid #8a2be2;
    text-align: center;
    margin-top: 5%;
    border-radius: 15px;
}
#he div{
    position: absolute;
    left: 10px
    margin: 0 auto;
    margin-top: -5px;
    width: 100%;
    color: white;
    background-color: #8a2be2;
    text-align: center;
    box-shadow: 5px 5px 5px grey;
    border-radius: 5px;
    font-size: 70px;

}

#he p{
    letter-spacing: 20px;
    text-align: center;
    font-size: 30px;
   /* text-shadow: 1px 1px gray;*/
    position: relative;
    bottom: -40%;
}

button{
    margin: 0px auto;
    margin-top: 1%;
    background-color: #8a2be2;
    color: white;
    height: 40px;
    width: 100px;
    
}
button:hover{
    background-color: white;
    color: #8a2be2;
}


#box1:hover{
    width-left:900px;
    z-index: 1;
    
}
#box2:hover{
    width-left:900px;
    z-index: 5;
    }
    
    #box3:hover{
    width-left:900px;
    z-index: 5;
    }
    #box4:hover{
    width-left:900px;
    z-index: 5;
    }
    
    #box5:hover{
    width-left:900px;
    z-index: 5;
    
    }
    #box6:hover{
    width-left:900px;
    z-index: 5;
    
    }
   .ratingStar
{
width:50px;
height:50px;
margin:2px;
padding:2px;
cursor:pointer;
display:block;
background-repeat:no-repeat;
font-size:10px;
}

.filledRatingStar
{background-image:url(/ratingImages/1.png)}

.emptyRatingStar
{background-image:url(/ratingImages/2.png)}

.savedRatingStar
{background-image:url(/ratingImages/3.png)} 